<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>果蔬缤纷</title>
	<link rel="stylesheet" type="text/css" href="./css/reset.css">
	<link rel="stylesheet" type="text/css" href="./css/common.css">
	<link rel="stylesheet" type="text/css" href="./css/productList.css">
</head>
<body>
	<!--header-->
	<div id="header">
		<div class="loginBar fl">
			<span>欢迎来果蔬缤纷&nbsp;请</span><a href="#" class="login">登录</a><span class="dividing"></span><a href="#" class="register">注册</a>
		</div>
		<div class="memberLink fr">
			<a href="#">收藏网站</a><span class="dividing"></span><a href="#">我的订单</a><span class="dividing"></span><a href="#">会员中心</a><span class="dividing"></span><a href="#">帮助中心</a>
		</div>
		<div class="headerMain">
			<div class="logo fl">
				<a href="#"><img src="./image/tools/logo.jpg" title="果蔬缤纷"></a>
			</div>
			<div class="search fl">
				<div class="searchForm">
					<input type="text" name="searchText" placeholder="蔬菜、水果、香蕉" class="searchText">
					<input type="button" class="searchBtn" value="搜索" >
				</div>
				<div class="hotKeywords">
					<span class="hot">热门搜索：</span>
					<a href="#">奇异果</a>
					<a href="#">苹果</a>
					<a href="#">芒果</a>
					<a href="#">香蕉</a>
					<a href="#">榴莲</a>
					<a href="#">西瓜</a>
					<a href="#">梨</a>
				</div>
			</div>
			<div class="callPhone fr">
				<img src="./image/tools/phone.jpg">
			</div>
		</div>
	</div>
	<!--nav start-->
	<div id="nav">
		<ul class="navList fl">
			<li class="fl allList list">
				<a href="javascript:void(0)" class="listA">
					所有商品分类
					<ul class="detailsList">
						<li class="product_1">
							<div class="kinds">
								<a href="#"><i></i>进口水果</a>
							</div>
							<dl class="kindsDl">
								<dt class="fl kindsDt">推荐</dt>
								<dd class="fl kindsDd"><a href="#">百香果</a><a href="#">榴莲</a><a href="#">柑橘类</a></dd>
							</dl>
							<div class="moreDetailLisrt">
								<dl>
									<dd>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
									</dd>									
								</dl>
							</div>
						</li>
						<li class="product_2">
							<div class="kinds">
								<a href="#"><i></i>国产水果</a>
							</div>
							<dl class="kindsDl">
								<dt class="fl kindsDt">推荐</dt>
								<dd class="fl kindsDd"><a href="#">番石榴</a><a href="#">柑橘类</a><a href="#">梨类</a></dd>
							</dl>
							<div class="moreDetailLisrt">
								<dl>
									<dd>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
									</dd>									
								</dl>
							</div>
						</li>
						<li class="product_3">
							<div class="kinds">
								<a href="#"><i></i>新鲜蔬菜</a>
							</div>
							<dl class="kindsDl">
								<dt class="fl kindsDt">推荐</dt>
								<dd class="fl kindsDd"><a href="#">豆角类</a><a href="#">叶菜类</a><a href="#">瓜类</a></dd>
							</dl>
							<div class="moreDetailLisrt">
								<dl>
									<dd>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
									</dd>									
								</dl>
							</div>
						</li>
						<li class="product_4">
							<div class="kinds">
								<a href="#"><i></i>粮油副食</a>
							</div>
							<dl class="kindsDl">
								<dt class="fl kindsDt">推荐</dt>
								<dd class="fl kindsDd"><a href="#">杂粮类</a><a href="#">大米类</a><a href="#">花生油</a></dd>
							</dl>
							<div class="moreDetailLisrt">
								<dl>
									<dd>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
									</dd>									
								</dl>
							</div>
						</li>
						<li class="product_5">
							<div class="kinds">
								<a href="#"><i></i>肉禽蛋奶</a>
							</div>
							<dl class="kindsDl">
								<dt class="fl kindsDt">推荐</dt>
								<dd class="fl kindsDd"><a href="#">家禽</a><a href="#">猪肉类</a><a href="#">蛋类</a></dd>
							</dl>
							<div class="moreDetailLisrt">
								<dl>
									<dd>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
									</dd>									
								</dl>
							</div>
						</li>
						<li class="product_6">
							<div class="kinds">
								<a href="#"><i></i>休闲食品</a>
							</div>
							<dl class="kindsDl">
								<dt class="fl kindsDt">推荐</dt>
								<dd class="fl kindsDd"><a href="#">蜂蜜</a><a href="#">玫瑰系列</a><a href="#">坚果</a></dd>
							</dl>
							<div class="moreDetailLisrt">
								<dl>
									<dd>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
										<a href="">百香果</a>
									</dd>									
								</dl>
							</div>
						</li>
					</ul>
				</a>
			</li>
			<li class="fl otherList list"><a href="#" class="listA">首页</a></li>
			<li class="fl otherList list"><a href="#" class="listA">新鲜蔬菜</a></li>
			<li class="fl otherList list"><a href="#" class="listA">果乐缤纷</a></li>
			<li class="fl otherList list"><a href="#" class="listA">优惠专区</a></li>
			<li class="fl otherList list"><a href="#" class="listA">用户留言</a></li>
		</ul>

		<div class="cartBar fl">
			<span class="cartIcon">&#xe015;</span>
			<span class="cartText">购物车中有</span>
			<strong class="cartNumber">23</strong>
			<span class="cartText">商品</span>
			<a href="#" class="cartGo">去结算</a>
		</div>
	</div>
	<!--search content start-->
	<div id="searchContent">
		<h2>所有商品</h2>
		<div class="searchConditions">
			<dl>
				<dt>分类：</dt>
				<dd><a href="#" class="unlimited">不限</a></dd>
				<dd><a href="#">进口水果</a></dd>
				<dd><a href="#">国产水果</a></dd>
				<dd><a href="#">新鲜蔬菜</a></dd>
				<dd><a href="#">粮油副食</a></dd>
				<dd><a href="#">肉禽蛋奶</a></dd>
			</dl>
			<dl>
				<dt>产地：</dt>
				<dd><a href="#" class="unlimited">不限</a></dd>
				<dd><a href="#">新西兰</a></dd>
				<dd><a href="#">美国</a></dd>
				<dd><a href="#">南非</a></dd>
				<dd><a href="#">澳大利亚</a></dd>
				<dd><a href="#">越南</a></dd>			
				<dd><a href="#">泰国</a></dd>			
				<dd><a href="#">菲律宾</a></dd>			
				<dd><a href="#">台湾</a></dd>			
			</dl>

			<dl>
				<dt>产地：</dt>
				<dd><a href="#" class="unlimited">不限</a></dd>
				<dd><a href="#">0-50元</a></dd>
				<dd><a href="#">51-100元</a></dd>
				<dd><a href="#">101-150元</a></dd>
				<dd><a href="#">151-200元</a></dd>
				<dd><a href="#">201-250元</a></dd>			
				<dd><a href="#">251-300元</a></dd>			
				<dd><a href="#">300元以上</a></dd>			
			</dl>
		</div>
		<!--价格、热销搜索-->
		<div class="priceSales">
			<div class="toolItemLeft fl">
				<a href="#" class="priceBtn">价格</a>
				<a href="#" class="numberBtn">销量</a>
			</div>
			<div class="toolItemRight fr">
				<span class="totalNum">
					共<b></b>110个商品
				</span>
				<span class="toolPager">
					<span class="pagerNum">
						<b class="pagerCur">4</b>/<em class="pagerTotal">17</em>
					</span>
					<a href="#" class="pagerPrev"></a>
					<a href="#" class="pagerNext"></a>
				</span>
			</div>
		</div>

	</div>
	<div id="searchResultsList">
		<ul>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
			<a href="#">
				<li class="fl">
					<div class="wrapImgs"><img src="./image/goods/saled04.jpg"></div>
					<p class="productdescription">新西兰zespri佳沛绿奇异果 33/36个原箱33/36个原箱33/36个原箱</p>
					<p class="productPrice">
						<span class="nowPrice fl">￥<b>18</b></span>
						<span class="oldPrice fr">￥<b>22</b></span>
					</p>
					<div class="tools">
						<span class="btnCart">加入购物车</span>
						<span class="btnCollection">收&nbsp;&nbsp;&nbsp;&nbsp;藏</span>
					</div>
				</li>
			</a>
		</ul>
	</div>
	<!--page 分页部分-->
	<div id="page">
		<p>
			<a href="#">首页</a>
			<a href="#">上一页</a>
			<a href="#" class="hoverStyle">1</a>
			<a href="#">2</a>
			<a href="#">3</a>
			<a href="#">4</a>
			<a href="#">5</a>
			<a href="#">6</a>
			<a href="#">7</a>
			<a href="#">下一页</a>
			<a href="#">尾页</a>
		</p>
	</div>
	<!--footer start-->
	<div id="guarantee"></div>
	<div id="footer">
		<div class="footerTop clear">
			<ul class="fl">
				<li class="liFirst">关于我们</li>
				<a href=""><li>人才招聘</li></a>
			</ul>
			<ul class="fl">
				<li class="liFirst">客户服务</li>
				<a href=""><li>联系我们</li></a>
			</ul>
			<ul class="fl">
				<li class="liFirst">帮助中心</li>
				<a href=""><li>配送方式</li></a>
				<a href=""><li>支付方式</li></a>
				<a href=""><li>售后服务</li></a>
			</ul>
			<ul class="fl">
				<li class="liFirst">会员中心</li>
				<a href=""><li>收藏列表</li></a>
				<a href=""><li>会员中心</li></a>
				<a href=""><li>历史订单</li></a>
			</ul>
		</div>
		<div class="footerBottom">
			<span>Copyright 2015果乐缤纷 www.guolebinfen.com Inc. AllRights Reserved. 京ICP备130443637号</span>
		</div>
	</div>
</body>
<script type="text/javascript" data-main="./js/productList" src="./js/require.js"></script>
</html> 